/**
 * 单表格的增删改的业务逻辑处理
 */
export default {
  data() {
    return {
      queryForm: { // 查询form对象
        value: ''
      },
      selected: [], // 表格checkbox的选中数组
      action: 'add', // 操作类型：新增 or 编辑
      ids: '', // 表格checkbox的选中数组的id集合
      tableData: [], // table的数据data
      dialog: false, // drawer 新增编辑的抽屉状态
      loading: false, // 编辑修改，提交按钮的loading
      tableLoading: false, // table的loading状态
      delBtnLoading: false, // 删除按钮的loading状态
      actionForm: {}, // 新增编辑的form对象
      refreshTimer: null, // 刷新按钮的时间对象
      refreshTimes: 0, // 刷新按钮的时间倒计时
      timeCount: 15, // 刷新按钮的时间长度
      refreshBtnDisabled: false, // 刷新按钮的禁用状态
      refreshBtnFlag: false // 刷新按钮的标志位
    }
  },
  computed: {
    /**
     * 新增编辑弹出窗的标题
     * @returns {string}
     */
    title() {
      return (this.action === 'add' ? '新增' : '编辑') + this.pageName
    },
    /**
     * table 表格头 column的配置项
     * @returns {*}
     */
    tableColumn() {
      return this.getTableColumnConfig({ list: this.domain })
    },
    /**
     * 新增编辑的form配置项
     * @returns {*}
     */
    actionFormConfig() {
      return this.getActionFormConfig({ list: this.domain })
    }
  },
  mounted() {
    // 初始化 form 和初始化请求table数据
    this.actionForm = this.initFormValue({ list: this.domain })
    this.fetchAll()
  },
  methods: {
    /**
     * 查询：查询按钮的点击事件，将表格分页当前页设置为1
     * @param formName
     */
    onSearch(formName) {
      this.currentPage = 1
      this.fetchAll()
    },
    /**
     * 查询：重置按钮的点击事件，将表格分页当前页设置为1
     * @param formName form的ref属性值
     */
    onReset(formName) {
      this.$refs[formName].resetFields()
      this.currentPage = 1
      this.fetchAll()
    },
    /**
     * 表格：checkbox的清空所有选中的事件
     * @param refsName 表格ref属性值
     */
    handleClearSelected(refsName) {
      this.$refs[refsName].clearSelection()
    },
    /**
     * 表格：checkbox 当选择项发生变化时会触发该事件
     * @param v  事件返回当前选中的项
     */
    handleSelectionChange(v) {
      this.selected = v
    },
    /**
     * 表格：编辑按钮的触发事件
     * @param params  当前行的scope的对象，通过params.row可拿到行数据
     */
    handleEdit(params) {
      this.action = 'edit'
      params.row.editloading = true
      this.getRecord && this.getRecord instanceof Function && this.getRecord(params.row.id).then(res => {
        this.actionForm = res.data
        // editRenderBefore 编辑展示之前的处理函数，将返回的数据做自定义处理，res接口的返回数据
        this.editRenderBefore && this.editRenderBefore instanceof Function && this.editRenderBefore(res)
        this.dialog = true
      }).finally(() => {
        params.row.editloading = false
      })
    },
    /**
     * 表格：删除按钮的触发事件
     * @param params 当前行的scope的对象，通过params.row可拿到行数据
     */
    handleDelete(params) {
      this.$confirm('确定执行删除操作？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        params.row.delloading = true
        this.ids = params.row[this.deleteKeyName || 'id']
        this.fetchDelete(params)
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    /**
     *  总删除按钮的触发事件
     */
    handleDeleteAll() {
      this.$confirm('确定执行删除操作？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.delBtnLoading = true
        // deleteKeyName 是数据删除的关键key
        const arr = this.selected.map(item => {
          return item[this.deleteKeyName || 'id']
        })
        this.ids = arr.join(',')
        this.fetchDelete()
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    /**
     * 新增按钮的触发事件
     */
    handleAdd() {
      this.action = 'add'
      this.actionForm = this.initFormValue({ list: this.domain })
      // addRenderBefore 新增展示之前的处理函数，例如设置默认值
      this.addRenderBefore && this.addRenderBefore instanceof Function && this.addRenderBefore()
      this.dialog = true
    },
    /**
     * 刷新按钮的触发事件
     */
    handleRefresh() {
      this.refreshBtnFlag = true
      this.currentPage = 1
      this.fetchAll()
      this.initFetchTables && this.initFetchTables instanceof Function && this.initFetchTables()
    },
    /**
     * 新增编辑 弹出窗的提交按钮事件
     * @param formName form的ref属性值
     */
    onSubmit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.loading = true
          const funName = this.action === 'add' ? this.createRecord : this.updateRecord
          // submitBefore 如果有提交之前的处理函数，必须返回提交的数据对象
          const flag = this.submitBefore && this.submitBefore instanceof Function
          funName && funName instanceof Function && funName(flag === true ? this.submitBefore() : this.actionForm).then(res => {
            this.dialog = false
            this.$message({
              message: res.message,
              type: 'success',
              duration: 2 * 1000
            })
            this.fetchAll()
            // submitCallback 提交成功之后的回调函数
            this.submitCallback && this.submitCallback instanceof Function && this.submitCallback(res)
          }).finally(() => {
            this.loading = false
          })
        } else {
          return false
        }
      })
    },
    /**
     * 表格的查询接口
     */
    fetchAll() {
      if (this.getAll && this.getAll instanceof Function) {
        this.tableLoading = true
      }
      this.getAll && this.getAll instanceof Function && this.getAll({
        queryinfo: this.queryForm.value, // 模糊查询字段
        page: this.currentPage, // 当前页
        size: this.pageSize // 每页的长度
      }).then(res => {
        this.tableData = res.data && res.data.content || []
        this.totalPage = res.data && res.data.totalElements || 0
        // getAllCallback 获取列表之后的回调函数
        this.getAllCallback && this.getAllCallback instanceof Function && this.getAllCallback(res)
      }).finally(() => {
        this.tableLoading = false
        if (this.refreshBtnFlag === true) {
          this.refreshBtnDisabled = true
        }
        if (!this.refreshTimer && this.refreshBtnFlag === true) {
          this.refreshTimes = this.timeCount
          this.refreshTimer = setInterval(() => {
            if (this.refreshTimes > 0 && this.refreshTimes <= this.timeCount) {
              this.refreshTimes--
            } else {
              this.refreshBtnDisabled = false
              this.refreshBtnFlag = false
              clearInterval(this.refreshTimer)
              this.refreshTimer = null
            }
          },1000)
        }
      })
    },
    /**
     * 删除的接口
     * @param params 当前行的scope的对象，通过params.row可拿到行数据
     */
    fetchDelete(params) {
      // deleteBefore 如果有提交之前的处理函数，必须返回提交的数据对象
      const flag = this.deleteBefore && this.deleteBefore instanceof Function
      this.removeRecord && this.removeRecord instanceof Function && this.removeRecord(flag === true ? this.deleteBefore(this.ids) : this.ids).then(res => {
        this.$message({
          message: res.message,
          type: 'success',
          duration: 2 * 1000
        })
        this.fetchAll()
        // deleteCallback 删除成功之后的回调函数
        this.deleteCallback && this.deleteCallback instanceof Function && this.deleteCallback(res)
      }).finally(() => {
        this.delBtnLoading = false
        if (params) {
          params.row.delloading = false
        }
      })
    }
  }
}
